{% extends 'myadmin/index.html' %}

{% block title %}
<title>后台-会员列表</title>
{% endblock %}
{% block index %}
  <a href="{% url 'myadmin_index' %}">
      <i class="am-icon-home sidebar-nav-link-logo"></i> 首页
  </a>
  {% endblock %}
{% block cate %}
<li class="sidebar-nav-link ">
    <a href="javascript:;" class="sidebar-nav-sub-title active">
        <i class="am-icon-cubes sidebar-nav-link-logo"></i> 商品分类管理
        <span class="am-icon-chevron-down am-fr am-margin-right-sm sidebar-nav-sub-ico"></span>
    </a>
    <ul class="sidebar-nav sidebar-nav-sub" style="display: block;">
        <li class="sidebar-nav-link">
            <a href="{% url 'myadmin_cates_index' %}" class="active">
                <span class="am-icon-angle-right sidebar-nav-link-logo"></span> 商品分类列表
            </a>
        </li>
    </ul>
</li>
{% endblock %}



{% block main %}
<script type="text/javascript" src="/static/myadmin/js/jquery.min.js"></script>
<div class="row-content am-cf">
  <div class="row">
    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
      <div class="widget am-cf">
        <div class="widget-head am-cf">
          <div class="widget-title  am-cf">商品分类列表</div></div>
        <div class="widget-body  am-fr">
          <div class="am-u-sm-12 am-u-md-6 am-u-lg-6">
            <div class="am-form-group">
              <div class="am-btn-toolbar">
                <div class="am-btn-group am-btn-group-xs">
                  <a href="{% url 'myadmin_cates_add' %}?p={{request.GET.p}}" class="am-btn am-btn-default am-btn-success">
                    <span class="am-icon-plus"></span>新增</a>
                </div>
              </div>
            </div>
          </div>
          <form>
          <div class="am-u-sm-12 am-u-md-6 am-u-lg-3">
            <div class="am-form-group tpl-table-list-select">
              <!-- <select name="types" data-am-selected="{btnSize: 'sm'}" id="sel">
              {% load pagetag %}
                <option value="all">所有</option>
                {% for i in data %}
                <option value="{{i.id}}" class="opt"><span>{% sj i.paths %}</span><span class="ss">{{i.name}}</span></option>
                {% endfor %}
                </select> -->
            </div>
            <!-- <script type="text/javascript">
                $("#sel").change(function(){
                    el = $(this)
                    id = el.val()
                    $.get('{% url "myadmin_cates_query" %}',{"id":id},function(data){
                          
                    },'json')
                })
            </script> -->
            <div class="am-input-group am-input-group-sm tpl-form-border-form cl-p inp">
              <input value="{{request.GET.val}}" type="text" class="am-form-field " name="val">
              <span class="am-input-group-btn">
                <button class="am-btn  am-btn-default am-btn-success tpl-table-list-field am-icon-search"></button>
              </span>
            </div>
          </div>

<!--           <div class="am-u-sm-12 am-u-md-12 am-u-lg-3">
            <div class="am-input-group am-input-group-sm tpl-form-border-form cl-p">
              <input value="{{request.GET.textVal}}" type="text" class="am-form-field " name="textVal">
              <span class="am-input-group-btn">
                <button class="am-btn  am-btn-default am-btn-success tpl-table-list-field am-icon-search"></button>
              </span>
            </div>
          </div> -->
          </form>
          <div class="am-u-sm-12">
            <table width="100%" class="am-table am-table-compact am-table-striped tpl-table-black " id="">
              <thead>
                <tr>
                  <th>ID</th>
                  <th>分类名</th>
                  <th>所属分类</th>
                  <th>操作</th>
                </tr>
              </thead>
              <tbody>
              {% load pagetag %}
              {% for i in data %}
                <tr class="gradeX">
                  <td>{{i.id}}</td>
                  <td>
                    <span>{% sj i.paths %}</span><span class="ss">{{i.name}}</span>
                  </td>
                  <td>
                  {{i.fen}}
                  </td>
                  <td class="clone">
                    <div class="tpl-table-black-operation">
                      <a href='javascript:void(0)' class="tpl-table-black-operation-del">
                        <i class="am-icon-trash"></i>删除</a>
                    </div>
                  </td>
                </tr>
                {% endfor %}
                <!-- more data -->
                </tbody>
            </table>
          </div>
          <div class="am-u-lg-12 am-cf">
            <div class="am-fr">
              <ul class="am-pagination tpl-pagination">
                {% load pagetag %}
                {% showCatesPage data.paginator.num_pages request %}
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<script type="text/javascript">
     // 删除
    $(".tpl-table-black-operation-del").click(function(){
      el = $(this)
      cid = $(this).parents("tr").find("td:first").text()
      $.get("{% url 'myadmin_cates_delete' %}",{"id":cid},function(data){
          if (data.error){
            el.parents("tr").remove()
          }else{
            alert("对不起,无法删除")
          }
      },'json')
    })
    // 修改
    $(".gradeX").dblclick(function(){
        el = $(this)
        name1 = $(this).find(".ss").text()
        inp = $("<input value='"+$(this).find(".ss").text()+"'style='color:#000'/>")
        $(this).find(".ss").html(inp)
        inp.select()
        $(inp).blur(function(){
            if ($(this).val() != name1){
                cid = el.find("td:first").text()
                cname = $(this).val()
                $.get("{% url 'myadmin_cates_update' %}",{"cid":cid,"cname":cname},function(data){
                    if (!data.error){
                        inp.remove()
                        el.find(".ss").text(cname)
                    }
                },'json')
            }else{
              el.find(".ss").html(name1)
            }
        })
        
    })
</script>
</div>
{% endblock %}